<form class="form-inline" id="keyword_form">
    <div class="input-group">
        <div class="input-group-addon"> 公众号</div>
        <select id="mp" name="mp" class="form-control">
            <option value="0" selected="selected">易企秀</option>
        </select>
    </div>
    <div class="form-group">
        <div class="input-group">
            <div class="input-group-addon"> id</div>
            <input type="text" class="form-control" name="id"/>
        </div>
    </div>

    <div class="form-group">
        <div class="input-group">
            <div class="input-group-addon"> 关键字</div>
            <input type="text" class="form-control" name="matchContent"/>
        </div>
    </div>
    <div class="form-group">
        <div class="input-group">
            <div class="input-group-addon"> 内容</div>
            <input type="text" class="form-control" name="replyContent"/>
        </div>
    </div>
    <br/>
    <button type="button" class="btn btn-primary"
            onclick="query_keyword_list('#keyword_grid', '/m/ie/mp/keyword/list.json')">查询
    </button>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <button type="button" class="btn btn-primary" onclick="add_keyword()">新增</button>
</form>


<table id="keyword_grid" data-toggle="table" data-toolbar="#keyword_form" data-unique-id="id"
       data-query-params="keyword_params" data-click-to-select="true" data-page-size="20">
    <thead>
    <tr>
        <th data-field="id">ID</th>
        <th data-field="mpName" data-formatter="mp_valuer">公众号</th>
        <th data-field="matchContent">关键字</th>
        <th data-field="replyContent">内容</th>
        <#--        <th data-field="updateTime">最后更新时间</th>-->
        <th data-field="id" data-align="center" data-formatter="keyword_operation_format">操作</th>
    </tr>
    </thead>
</table>


<!------------------------------新增关键字的弹框----------------------------->
<div id="add_keyword_module" class="modal fade" role="dialog" aria-labelledby="keyword_title">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="keyword_title">添加关键字</h4>
            </div>
            <div class="modal-body">
                <form class="form-inline" id="newKeywordForm">
                    <div class="form-group">
                        <div class="input-group">
                            <div class="input-group-addon"> 公众号</div>
                            <select id="mp" name="mp" class="form-control">
                                <option value="0" selected="selected">易企秀</option>
                            </select>
                        </div>
                    </div>
                    <br/><br/>
                    <div class="form-group">
                        <div class="input-group">
                            <div class="input-group-addon">关键字</div>
                            <input type="text" id="new_matchContent" value="" name="matchContent" class="form-control"
                                   style="width: 450px;">
                        </div>
                    </div>
                    <br/><br/>
                    <div class="form-group">
                        <div class="input-group">
                            <div class="input-group-addon">内容&nbsp;&nbsp;&nbsp;</div>
                            <textarea type="text" id="new_replyContent" value="" name="replyContent"
                                      class="form-control"
                                      style="width: 450px; height: 450px"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="addKeywordForm()">保存</button>
            </div>
        </div>
    </div>
</div>


<!------------------------------编辑关键字的弹框----------------------------->
<div id="edit_keyword_module" class="modal fade" role="dialog" aria-labelledby="keyword_title">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="keyword_title">编辑关键字</h4>
            </div>
            <div class="modal-body">
                <form class="form-inline" id="editKeywordForm">
                    <div class="form-group">
                        <div class="input-group">
                            <div class="input-group-addon"> 公众号</div>
                            <select id="mp" name="mp" class="form-control">
                                <option value="0" selected="selected">易企秀</option>
                            </select>
                        </div>
                    </div>
                    <br/><br/>

                    <div class="form-group">
                        <div class="input-group">
                            <div class="input-group-addon">ID&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
                            <input type="text" id="id" value="" name="id" class="form-control"
                                   style="width: 450px;">
                        </div>
                    </div>
                    <br/><br/>
                    <div class="form-group">
                        <div class="input-group">
                            <div class="input-group-addon">关键字</div>
                            <input type="text" id="update_matchContent" value="" name="matchContent"
                                   class="form-control"
                                   style="width: 450px;">
                        </div>
                    </div>
                    <br/><br/>
                    <div class="form-group">
                        <div class="input-group">
                            <div class="input-group-addon">内容&nbsp;&nbsp;&nbsp;</div>
                            <textarea type="text" id="update_replyContent" value="" name="replyContent"
                                      class="form-control"
                                      style="width: 450px; height: 450px"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="updateKeywordForm()">更新</button>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(document).ready(function () {
        ///日期控件
        $('#start_time,#end_time').datetimepicker();
    });

    //查询
    function query_keyword_list(id, url) {
        $(id).bootstrapTable('refresh', {url: url});
    }

    function keyword_params(params) {
        $('#keyword_form :input').each(function () {
            if ($(this).attr('name')) {
                params[$(this).attr('name')] = $(this).val();
            }
        });
        return params;
    }

    function keyword_operation_format(value, item) {
        return '<button type="button" class="btn btn-link" onclick="updateKeyword(' + value + ')">编辑</button>' +
            '<button type="button" class="btn btn-link" onclick="deleteKeyword (' + value + ')">删除</button>';
    }

    function mp_valuer(value) {
        return "易企秀";
    }

    //新增关键字--弹出弹框
    function add_keyword() {
        document.getElementById("new_matchContent").value = "";
        document.getElementById("new_replyContent").value = "";
        $('#add_keyword_module').modal('show');
    }

    //新增
    function addKeywordForm() {

        if ($('#new_matchContent').val() == null || $('#new_matchContent').val() == '') {
            error("关键字不能为空");
            return;
        }
        if ($('#new_replyContent').val() == null || $('#new_replyContent').val() == '') {
            error("内容不能为空");
            return;
        }
        $.ajax({
            url: mpath + "/ie/mp/keyword/save",
            type: "POST",
            data: $('#newKeywordForm').serialize(),
            success: function (data, ts, xhr) {
                if (data.success) {
                    $('#add_keyword_module').modal('hide');
                    success("保存成功");
                } else {
                    error(data.msg);
                }
                $('#keyword_grid').bootstrapTable('refresh');
            }
        });
    }

    //编辑关键字--弹出弹框
    function updateKeyword(id) {
        $('#id').attr('readonly', true);
        setFormValue('editKeywordForm', $('#keyword_grid').bootstrapTable('getRowByUniqueId', id))
        $('#edit_keyword_module').modal('show');
    }

    //编辑
    function updateKeywordForm() {
        if ($('#update_matchContent').val() == null || $('#update_matchContent').val() == '') {
            error("关键字不能为空");
            return;
        }
        if ($('#update_replyContent').val() == null || $('#update_replyContent').val() == '') {
            error("内容不能为空");
            return;
        }
        $.ajax({
            url: mpath + "/ie/mp/keyword/update",
            type: "POST",
            data: $('#editKeywordForm').serialize(),
            success: function (data, ts, xhr) {
                console.error(data.msg);
                if (data.success) {
                    $('#edit_keyword_module').modal('hide');
                    success("更新成功");
                } else {
                    error(data.msg);
                }
                $('#keyword_grid').bootstrapTable('refresh');
            }
        });
    }

    //删除
    function deleteKeyword(id) {
        openDialog({
            title: '删除确认',
            message: "<p>确定要删除已选择的记录吗？</p>",
            okAction: function () {
                closeDialog();
                $.ajax({
                    url: mpath + "/ie/mp/keyword/delete?id=" + id,
                    type: "get",
                    success: function (data) {
                        if (data.success) {
                            success("删除成功");
                        } else {
                            error(data.msg);
                        }
                        $('#keyword_grid').bootstrapTable('refresh');
                    }
                });
            }
        });
    }

</script>